<template>
  <div id="entrance_plan">
    <div id="search_box">
      <el-card shadow="hover">
        <el-button type="primary" icon="el-icon-upload" @click="dialogVisible = true">上传入学条件</el-button>
      </el-card>
    </div>
    <div id="table_box">
      <el-table
        :data="tableData"
        border
        stripe
        style="width: 100%">
        <el-table-column
          label="序号"
          width="50"
          type="index"
          align="center">
        </el-table-column>
        <el-table-column
          prop="stageNum"
          label="学期">
        </el-table-column>
        <el-table-column
          prop="condition1Num"
          label="维吾尔族">
        </el-table-column>
        <el-table-column
          prop="condition2Num"
          label="非维吾尔族">
        </el-table-column>
        <el-table-column
          label="状态"
          align="center"
          width="220">
          <template slot-scope="scope">
            <el-switch
              v-model="scope.row.isOver"
              active-text="在用"
              inactive-text="停用"
              active-value="0"
              inactive-value="1"
              @change="updateCondition(scope.row)">
            </el-switch>
          </template>
        </el-table-column>
        <el-table-column
          label="操作"
          align="center"
          width="100">
          <template slot-scope="scope">
            <el-button
              type="danger"
              size="mini"
              @click="del(scope.row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div v-if="dialogVisible">
      <el-dialog
        title="上传入学条件"
        :visible.sync="dialogVisible"
        width="30%">
        <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
          <el-form-item label="学 期" prop="stageNum">
            <el-input v-model="ruleForm.stageNum"></el-input>
          </el-form-item>
          <el-form-item label="维吾尔族" prop="condition1Num">
            <el-input v-model="ruleForm.condition1Num"></el-input>
          </el-form-item>
          <el-form-item label="非维吾尔族" prop="condition2Num">
            <el-input v-model="ruleForm.condition2Num"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="submitForm('ruleForm')">保 存</el-button>
            <el-button @click="dialogVisible = false">取 消</el-button>
          </el-form-item>
        </el-form>
      </el-dialog>
    </div>
  </div>
</template>
<script>
    import {selectCurrentEntryCondition, insertCondition, updateCondition, deleteCondition} from '@/api/entrance'
    export default {
        data() {
            return {
                tableData: [],
                dialogVisible: false,
                ruleForm: {
                    stageNum: '',
                    condition1: '维吾尔族',
                    condition1Num: '',
                    condition2: '非维吾尔族',
                    condition2Num: ''
                },
                rules: {
                    stageNum: [
                        {required: true, message: '请输入学期', trigger: 'blur'}
                    ],
                    condition1Num: [
                        {required: true, message: '请输入维吾尔族人数', trigger: 'blur'}
                    ],
                    condition2Num: [
                        {required: true, message: '请输入非维吾尔族人数', trigger: 'blur'}
                    ]
                }
            };
        },
        methods: {
            refresh_data(){
                selectCurrentEntryCondition({}).then((res) => {
                    if (res.code != "200") {
                        this.$message({
                            message: res.msg,
                            type: 'warning'
                        });
                    }else{
                        this.tableData = res.data;
                    }
                }).catch(() => {

                })
            },
            submitForm(formName) {
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        insertCondition(this.ruleForm).then((res) => {
                            if (res.code != "200") {
                                this.$message({
                                    message: res.msg,
                                    type: 'warning'
                                });
                            }else{
                                this.dialogVisible = false;
                                this.refresh_data();
                            }
                        }).catch(() => {

                        })
                    } else {
                        return false;
                    }
                });
            },
            updateCondition(row){
                let params = {
                    id: row.id,
                    isOver: row.isOver,
                }
                updateCondition(params).then((res) => {
                    if (res.code != "200") {
                        this.$message({
                            message: res.msg,
                            type: 'warning'
                        });
                    }else{
                        this.$message({
                            message: res.msg,
                            type: 'success'
                        });
                        this.refresh_data();
                    }
                }).catch(() => {

                })
            },
            del(row){
                this.$confirm('此操作将删除该记录, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    let params = {
                        id: row.id,
                        isDel: 1
                    }
                    deleteCondition(params).then((res) => {
                        if (res.code != "200") {
                            this.$message({
                                message: res.msg,
                                type: 'warning'
                            });
                        } else {
                            this.$message({
                                message: res.msg,
                                type: 'success'
                            });
                            this.refresh_data();
                        }
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });
            },
        },
        created(){
            this.refresh_data();
        }
    }
</script>
<style lang="scss">
  #entrance_plan {
    #search_box {
      margin: 10px;
    }
    #table_box {
      margin: 10px;
    }
  }
</style>
